<template>
  <div>
    <cus-modal ref="modal" title="盘点详情" width="1200">
      <Table
        border
        :loading="loading"
        :columns="columns"
        :data="data"
        :size="vuex_config.tableSize"
        height="565"
      >
        <template slot-scope="{ row,index }" slot="checkPackagingQty">
          <div class="flex">
          <!-- form.origin == 'FROM_ELECTRIC' ||  -->
            <div v-if="form.status == 'doing'" :key="index">
              <InputNumber
                :max="1000000"
                :min="0"
                :precision="row.isWeight== 1 ? 2:0"
                :value="row.checkPackagingQty"
                @on-change="inputOnChange($event,row,index)"
                :active-change="false"
              />
            </div>
            <div v-else> {{ row.checkPackagingQty || 0 }} </div>
          </div>
        </template>
      </Table>
      <div slot="footer">
        <slot name="footer">
          <div class="modal-footer">
          <!-- form.origin == 'FROM_ELECTRIC' ||  -->
            <cus-button v-if="form.status == 'doing'" type="primary" size="small" @onClick="postGoodscheckdtlUpdateCheckDataApi()"
              >保存</cus-button
            >
          </div>
        </slot>
      </div>
      <Spin size="large" fix v-if="loading"></Spin>
    </cus-modal>
  </div>
</template>

<script>
import {
  getGoodscheckdtlList,
  postGoodscheckdtlUpdateCheckData
} from "@/api/business/manager";

export default {
  components: {},
  name: "",
  data() {
    return {
      loading: false,
      ruleValidate: {},
      id:"",
      form:{},
      columns: [
        {
          title: "序号",
          type: "index",
          align: "center",
          fixed: "left",
          width: 70,
        },
        {
          title: "物资名称",
          key: "productName",
          align: "center",
          fixed: "left",
          minWidth: 100,
        },
        {
          title: "物资编码",
          key: "goodsCode",
          align: "center",
          minWidth: 145,
        },
        {
          title: "物资种类",
          key: "goodsTypeName",
          align: "center",
          minWidth: 100,
        },
        {
          title: "供应商",
          key: "supplierName",
          align: "center",
          minWidth: 100,
        },
        {
          title: "存储仓库",
          key: "stockName",
          align: "center",
          minWidth: 100,
        },
        {
          title: "库存量",
          key: "goodsPackagingQty",
          align: "center",
          minWidth: 100,
        },
        {
          title: "单位重量(Kg)",
          key: "unitWeight",
          align: "center",
          minWidth: 130,
        },
        {
          title: "计量单位",
          key: "model",
          align: "center",
          minWidth: 100,
        },
        {
          title: "单价(元)",
          key: "price",
          align: "center",
          minWidth: 100,
        },
        {
          title: "金额(元)",
          key: "money",
          align: "center",
          minWidth: 100,
        },
        {
          title: "盘点量",
          slot: "checkPackagingQty",
          align: "center",
          minWidth: 100,
        },
        {
          title: "结果",
          align: "center",
          minWidth: 100,
          render: (h, params) => {
            return h("div", [
              h(
                "span",
                {
                  style: {},
                },
                // profile：盘盈。loss：盘亏。正常：normal。默认值normal
                params.row.checkProfitLoss == "profile"
                  ? "盘盈"
                  : params.row.checkProfitLoss == "loss"
                  ? "盘亏"
                  : "正常"
              ),
            ]);
          },
        },
        {
          title: "盘点时间",
          key: "updateTime",
          align: "center",
          minWidth: 100,
        },
      ],
      data: [],
      checkNumData: [], // 盘点重量数据
    };
  },
  computed: {},
  mounted() {},
  methods: {
    show(row) {
      this.id = row.id;
      this.form = row;
      this.$refs["modal"].show = true;
      console.log('=============',this.form)
      this.checkNumData = []
      this.getGoodscheckdtlListApi();
    },
    onSave() {},
    inputOnChange($event,v,index) {
      console.log($event,v,index);
      console.log(111,v);
      this.data[index].checkPackagingQty = $event
        this.data[index].checkProfitLoss = this.data[index].goodsPackagingQty < this.data[index].checkPackagingQty ? 'profile' : this.data[index].goodsPackagingQty == this.data[index].checkPackagingQty ? 'normal' : 'loss' 
      let obj = {
        id: "",
        checkPackagingQty: "",
      };
      console.log(v.checkPackagingQty);
      obj.id = this.data[index].id;
      obj.checkPackagingQty  = JSON.parse(JSON.stringify(this.data[index].checkPackagingQty));
      this.checkNumData.push(obj);
      this.checkNumData = this.arrayUnique( this.checkNumData, 'id')
    },
    // 物资盘点明细列表-------------接口
    getGoodscheckdtlListApi() {
      return new Promise((resolve) => {
        getGoodscheckdtlList({ checkId: this.id }).then((res) => {
          if (res.retCode == 2000) {
            this.data = res.data;
            resolve();
          }
        });
      });
    },
    // 保存盘点重量------------------接口
    postGoodscheckdtlUpdateCheckDataApi() {
      return new Promise((resolve) => {
        postGoodscheckdtlUpdateCheckData(this.checkNumData).then((res) => {
          if (res.retCode == 2000) {
            this.$Message.success(res.retMsg)
            this.getGoodscheckdtlListApi();
            this.$parent.onInit();
            this.$refs["modal"].show = false;
            resolve();
          }
        });
      });
    },
    // 数组去重
    arrayUnique(arr, name) {
      console.log(arr);
      let hash = {};
      return arr.reduce((acc, cru, index) => {
        if (!hash[cru[name]]) {
          hash[cru[name]] = { index: acc.length };
          acc.push(cru);
        } else {
          acc.splice(hash[cru[name]]["index"], 1, cru);
        }
        return acc;
      }, []);
    },
  },
};
</script>

<style scoped>
</style>
